<template>
  <c-model v-model="show" width="810px" title="选择优惠券" class="coupon-model" @confirm="submit">
    <div class="list">
      <div class="item" v-for="(item, index) in list" :key="index" @click="select(item, index)">
        <div class="check" :class="{checked: currId == item.couponId}"/>
        <div class="card">
          <div class="left">
            <div class="money">
              <span>{{ item.title }}</span>{{ item.rate ? '折' : '元' }}
            </div>
            <div class="min-money" v-if="item.type == 1">
              <template v-if="item.conditionMoney > 0">充{{item.conditionMoney}}可用</template>
              <template v-else>无门槛</template>
            </div>
          </div>
          <div :class="['right', 'type-'+item.type]">
            <div class="name">
              <div>{{ item.couponName }}</div>
              <div class="desc mt-5" v-if="item.startTime">{{ item.startTime }} - {{ item.endTime }}</div>
            </div>
            <div class="desc">{{ item.remark }}</div>
          </div>
        </div>
      </div>
    </div>
  </c-model>
</template>
<script>
export default {
  name: "index",
  props: {
    value: true,
    list: {type: Array, default: () => []},
    selectId: null,
    source: {type: Number, default: 1}, // 来源 1-饮品券 2-门店活动
  },
  data() {
    return {
      currId: 0,
      sourceType: {
        1: '饮品券',
        2: '餐食券'
      }
    }
  },
  computed: {
    show: {
      get() {
        return this.value
      },
      set(val) {
        this.$emit("input", val)
      }
    }
  },
  methods: {
    select(item, index) {
      if (this.currId && item.couponId == this.currId) {
        this.currId = null
        return
      }
      this.currId = item.couponId
    },
    submit() {
      this.show = false
      if (!this.currId) {
        this.$emit("select", null)
        return
      }
      let item = this.list.find(item => item.couponId == this.currId)
      this.$emit("select", item)
    }
  },
  watch: {
    selectId() {
      this.currId = this.selectId
    }
  }
}
</script>


<style lang="scss">
@import "index";
</style>
